<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div th:fragment="salesPage" class="content"  id="indexPageDiv">
	<div class="sales-header">
		<div class="sales-wellcome" v-cloak>
			<div><img :src="agent.headUrl" style="border-radius:50%;"> 欢迎您，{{agent.name}}</div>
			<div v-if="!agent.auditStatus" v-html="'（'+ agent.auditStatus_fmt+'）'"></div>
		</div>
		<div class="sales-amount">
			<div v-for="sale in selfSales">{{sale.title}}：<span>{{sale.amount}}</span></div>
		</div>
		<div class="sales-goods">累计销售{{totalGoodsCount}}件商品</div>
	</div>
	<div class="row no-gutter text-center">
		<div class="col-50" :class="award.bg" :style="award.style" v-for="award in awardes">
		    <div class="card-content">
		    	<div><span class="iconfont" :class="award.icon" style="font-size: 2.5rem;"></span></div>
		    	<div>{{award.title}}</div>
		    	<div>{{award.amount}}</div>
		    </div>
		</div>
	</div>
	<div :class="sale.bg" v-for="sale in teamSales">
	    <div class="card-content row no-gutter" style="padding: 0.4rem 0;">
	    	<div class="col-25" style="padding: 0 0.4rem;"><span class="iconfont" :class="sale.icon" style="font-size: 1.5rem;"></span></div>
	    	<div class="col-75" style="margin-top: .5rem;">
		    	{{sale.title}} {{sale.amount}}
	    	</div>
	    </div>
	</div>
</div>

<div class="content" id="indexPageDiv">
	<div class="content-block-title">我的销量</div>
	<div class="row no-gutter text-center">
		<div class="card col-33" :class="sale.bg" :style="sale.style" v-for="sale in selfSales">
		    <div class="card-content">
		    	<div><span class="iconfont" :class="sale.icon" style="font-size: 2.5rem;"></span></div>
		    	<div>{{sale.title}}</div>
		    	<div>{{sale.amount}}</div>
		    </div>
		</div>
	</div>
	<div class="content-block-title">团队的销量</div>
	<div class="row no-gutter text-center">
		<div class="card col-33" :class="sale.bg" :style="sale.style" v-for="sale in teamSales">
		    <div class="card-content row no-gutter" style="padding: 0.4rem 0;">
		    	<div class="col-25" style="padding: 0 0.2rem;"><span class="iconfont" :class="sale.icon" style="font-size: 1.5rem;"></span></div>
		    	<div class="col-75">
			    	<div>{{sale.title}}</div>
			    	<div>{{sale.amount}}</div>
		    	</div>
		    </div>
		</div>
	</div>
	<div class="content-block-title">奖金</div>
	<div class="row no-gutter text-center">
		<div class="card col-50" :class="award.bg" :style="award.style" v-for="award in awardes">
		    <div class="card-content">
		    	<div><span class="iconfont" :class="award.icon" style="font-size: 2.5rem;"></span></div>
		    	<div>{{award.title}}</div>
		    	<div>{{award.amount}}</div>
		    </div>
		</div>
	</div>
</div>
</body>
</html>